<template>
  <div class="zhuce">
    <div class="box">
        <div class="warp">
            <div class="logo">
                <img src="../assets/jiazhenglogo.png" alt="">
            </div>
            <div class="zhuce">
                <div class="choice">
                    <button @click="touser">我要找家政</button>
                    <button @click="tostaff">我要做家政</button>
                </div>
            </div>
        </div>
    </div>
  </div>
</template>

<script>
export default {
    data(){
        return{
            
        }
    },
    methods:{
        touser(){
            this.$router.push('/user');
        },
        tostaff(){
            this.$router.push('/staff');
        }
    }
       
}
</script>

<style scoped>
.box{
  width: 100%;
}
.warp{
  position: relative;
  width: 1200px;
  box-sizing: border-box;
  padding: 50px;
  margin: 100px auto 0px;
  background-color: rgb(245, 245, 245);
}
.logo{
  position: absolute;
  top: -100px;
}
.zhuce{
    width: 100%;
    height: 100%;
    background-color: #fff;
    border-radius: 20px;
    padding-bottom: 30px;
}
.choice{
    text-align: center;
    padding:40px 0;
    width: 100%;
    height: 100%;
}
.choice button{
    outline: none;
    width: 300px;
    height:300px;
    background-color: rgb(245,111,124);
    border: none;
    color: #fff;
    font-size: 40px;
    border-radius: 50%;
    margin: 0 20px;
}
.choice button:hover{
    cursor: pointer;
    background-color: rgb(253,185,19);
}
</style>